<!--
Copyright 2003 Cordys R&D B.V. 

This file is part of the Cordys SAP Connector. 

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
-->
<!--
 Project  : Cordys BAC
 File Name : customergetlist.htm
 Description : This page is used as a demo page.This gets the list of customers from SAP.
 Author : Vijaya Gopal
 ======================== adjustment for BOP4 compliance ===============================================
 **                                                                                                   **
 ** changed: 26.aug2009: Helmut Boecker - xmlns:eibus="xmlns:eibus"                                   **
 ** changed: 26.aug2009: Helmut Boecker - moved the  tag </head> from end of dataisland before script **
 ** changed: 26.aug2009: Helmut Boecker - added application.js                                        **
 ** changed: 26.aug2009: Helmut Boecker - removed link to behaviors.css                               **
 ** changed: 26.aug2009: Helmut Boecker - getValue() for all occurences done                          ** 
 ** changed: 26.aug2009: Helmut Boecker - changed window.event.applicationDefinition to application.event.applicationDefinition    ** 
-->
<html xmlns:eibus="xmlns:eibus"  onselect="setTitle()">
<head>
		<script src="/cordys/wcp/application.js"></script>

	<style>
		input{font-size:11; font-family:verdana; width:100%; }
		label{font-size:11; font-family:verdana; }
		eibus\:select div{font-size:11; font-family:verdana; width:100%;}
	</style>
</head>

	<script language = "JScript">
	var flag_SoapFault = true;// To handle soapfault
	 //To the application definition and sets the title for the	page .
	function setTitle()
	{
		var applicationDef = application.event.applicationDefinition;
		window.application.container.setTitle(applicationDef.selectSingleNode(".//description").text,"BAC for SAP R/3");
	}
	//This function is used to validate the fields.
	function fnValidate()
	{
		if (maxrows.value == "0" )
		{
			alert("MAXROWS shall not be 0");
			return ;
		}
		var allTextFields = document.getElementsByTagName("input")
		for(i = 0;i<allTextFields.length;i++)
		{
			if(allTextFields[i].parentElement.parentElement.style.display != "none" && allTextFields[i].id != "cpdonly")
			{
				if(allTextFields[i].value == "")
				{
					alert(allTextFields[i].msg);
					allTextFields[i].select();
					return false;
				}
				else if(allTextFields[i].fieldType == "integer")
				{
					if(!isValidNumber(allTextFields[i]))
					{
						alert(allTextFields[i].msg);
						allTextFields[i].select();
						return false;
					}
				}
				else if(allTextFields[i].fieldType == "alphanumeric" )
				{
					if(!isValidAlphaNumeric(allTextFields[i]))
					{
						alert(allTextFields[i].msg);
						allTextFields[i].select();
						return false;
					}
				}
			}
		}
		if(cpdonly.value != "" && cpdonly.value != "X")
		{
			alert("Enter in capital letters X for one time customer or leave the CPD blank")
			cpdonly.value = "";
			cpdonly.focus();
			return false;
		}
		return true;
	}
	// To check if the given textbox contains a valid number or not
	function isValidNumber(objElement)
	{
		var value = objElement.value;
		var regExInteger = /[^0-9]/g;
		if(regExInteger.test(value))
			return false;
		return true;
	}
	// To check if the given text box contatins an alphanumeric value
	function isValidAlphaNumeric(objElement)
	{
		var value = objElement.value;
		var regExAlphaNumeric = /[^a-zA-Z0-9]/g;
		if(regExAlphaNumeric.test(value))
			return false;
		return true;
	}
	// To get the customers from the backend.
	function getCustomers()
	{
		if(fnValidate())
		{
			flag_SoapFault = true;
			showDetails.style.display = "none";
			var clone_reqGetList = reqGetList.XMLDocument.cloneNode(true);
			clone_reqGetList.selectSingleNode("SOAP:Envelope/SOAP:Body/Customer_GetList/MAXROWS").text = maxrows.value;
			var signValue = "";
			if (row_sign.style.display != "none")
				signValue = sign.getValue();   // ** hb: 26.aug2009 - replace value with getValue()
			else
			{
				if(option.getValue() == "LE" || option.getValue() == "LT") // ** hb: 26.aug2009 - replace value with getValue()
					signValue = "E";
			}
			clone_reqGetList.selectSingleNode("SOAP:Envelope/SOAP:Body/Customer_GetList/IDRANGE/item/SIGN").text = signValue;
			clone_reqGetList.selectSingleNode("SOAP:Envelope/SOAP:Body/Customer_GetList/IDRANGE/item/OPTION").text = option.getValue();  // ** hb: 26.aug2009 - replace value with getValue()
			clone_reqGetList.selectSingleNode("SOAP:Envelope/SOAP:Body/Customer_GetList/IDRANGE/item/LOW").text = low.value;
			clone_reqGetList.selectSingleNode("SOAP:Envelope/SOAP:Body/Customer_GetList/IDRANGE/item/HIGH").text = high.value;
			clone_reqGetList.selectSingleNode("SOAP:Envelope/SOAP:Body/Customer_GetList/CPDONLY").text = cpdonly.value;
			bdiGetList.request = clone_reqGetList;
			bdiGetList.clear();
			bdiGetList.reset();
			if(flag_SoapFault)
			{
				var addressDataTableNode;
				while(tbody_details.rows.length > 0)
					tbody_details.deleteRow();
				addressDataTableNode = bdiGetList.data.selectSingleNode("data/Customer_GetListResponse/ADDRESSDATA");
				if(!addressDataTableNode)
					addressDataTableNode = bdiGetList.data.selectSingleNode("data/Customer_GetListResponse/AddressData");// in case of BC
				var addressItemNodes = addressDataTableNode.selectNodes(".//item");
				var noOfItems = addressItemNodes.length;
				var newRow, newCell;
				if(noOfItems == 0)
				{
					newRow = tbody_details.insertRow();
					var newCell = newRow.insertCell();
					newCell.colSpan = "4";
					newCell.innerHTML = "<label><b> No customers found with the given search criteria. </b></label>" ;
				}
				else
				{
					for(var i=0; i<noOfItems; i++)
					{
						newRow = tbody_details.insertRow();
						newCell = newRow.insertCell();
						newCell.innerHTML = "<label>" + addressItemNodes[i].selectSingleNode(".//CUSTOMER").text +"</label>" ;
						newCell = newRow.insertCell();
						newCell.innerHTML = "<label>" + addressItemNodes[i].selectSingleNode(".//NAME").text +"</label>" ;
						newCell = newRow.insertCell();
						newCell.innerHTML = "<label>" + addressItemNodes[i].selectSingleNode(".//STREET").text +"</label>" ;
						newCell = newRow.insertCell();
						newCell.innerHTML = "<label>" + addressItemNodes[i].selectSingleNode(".//COUNTRY").text +"</label>" ;
					}
				}
				grid_details.redraw();
				showDetails.style.display = "block";
			}
		}
	}
	//This function displays the resultant reponse doc in a text Area.
	function fillGetListValues()
	{
		if(flag_SoapFault)
			showDetails.style.display = "block";
	}
	function setSOAPFaultFlag()
	{
		flag_SoapFault = false;
	}
	// To enable the relevant fields depending on the option chosen.
	function enableReleventFields()
	{
		switch (option.getValue())   // ** hb: 26.aug2009 - replace value with getValue()
		{
			case "GE" :
			case "GT" :
				row_sign.style.display = "none" ;
				row_low.style.display = "block" ;
				row_high.style.display = "none" ;
				lb_low.innerText = "LOW" ;
				high.value = "";
				break ;
			case "LE" :
			case "LT" :
				row_sign.style.display = "none" ;
				row_low.style.display = "none" ;
				row_high.style.display = "block" ;
				low.value = "";
				break ;
			case "NE" :
			case "EQ" :
				row_sign.style.display = "none" ;
				row_low.style.display = "block" ;
				row_high.style.display = "none" ;
				high.value = "";
				lb_low.innerText = "NUMBER" ;
				break ;
			case "BT" :
			case "NB" :
				row_sign.style.display = "block" ;
				row_low.style.display = "block" ;
				row_high.style.display = "block" ;
				lb_low.innerText = "LOW" ;
		}
	}
	function showInputTable()
	{
		table_input.style.display = "" ;
	}
	</script>

<eibus:dataisland
	 id = "bdiGetList"
	 async = "false"
	 onsoapfault="setSOAPFaultFlag()"
	 automatic = "false"/>
<xml id="reqGetList">
<SOAP:Envelope xmlns:SOAP="http://schemas.xmlsoap.org/soap/envelope/">
  <SOAP:Body>
    <Customer_GetList xmlns="http://schemas.cordys.com/1.0/SAPDemo">
		<MAXROWS>5</MAXROWS>
		<IDRANGE>
		  <item>
		    <SIGN></SIGN>
		    <OPTION></OPTION>
		    <LOW></LOW>
		    <HIGH></HIGH>
		  </item>
		</IDRANGE>
		<CPDONLY></CPDONLY>
    </Customer_GetList>
  </SOAP:Body>
</SOAP:Envelope>
</xml>
<body leftmargin="12" onload="showInputTable()">
	<table width="100%" height="90%" id="treeTable"  border="0" >
		<tr>
			<td  width="40%" align="center">
				<table width="90%" height="95%" cellspacing="0" cellpadding="0" id="table_input" style="display:none">
					<thead >
						<tr  height="20px" class="mediumdark">
							<th id="menuTitle" align="left" valign="top" nowrap>&nbsp;&nbsp;Request</th>
						</tr>
					</thead>
					<tbody>
						<tr>
							<td valign="middle" >
								<div id="MFlds" VALIGN="top" style="overflow:auto;width:100%;height:100%;border:1px solid gray" class="mainbody">
									<table  cellSpacing = "2"  cellPadding="1" width="80%" height="100%"  align = "center" >
										<tr>
											<td >
												<label>MAXROWS</label><br>
												<input id="maxrows"  class="input" style="width:100%" required fieldType="integer" msg="Enter number of customers in the MAXROWS field"  title="Maximum number of records to be retrieved" value="0"/>
											</td>
										</tr>
										<tr>
											<td >
												<label>OPTION</label><br>
												<eibus:select id="option" class="input" style = "width:100%" onchange = "enableReleventFields()">
													<div value="GE">&nbsp;Greater than or Equal to </div>
													<div value="LE">&nbsp;Less than or Equal to </div>
													<div value="GT">&nbsp;Greater than </div>
													<div value="LT">&nbsp;Less than</div>
													<div value="NE">&nbsp;Not Equal to </div>
													<div value="EQ">&nbsp;Equal to </div>
													<div value="BT">&nbsp;Between</div>
													<div value="NB">&nbsp;Not Between</div>
												</eibus:select>
											</td>
										</tr>
										<tr id="row_sign" style = "display:none">
											<td >
												<label>SIGN</label><br>
												<eibus:select id="sign" class="input"  style="width:100%">
													<div value="I">&nbsp;Inclusive</div>
													<div value="E">&nbsp;Exclusive</div>
												</eibus:select>
											</td>
										</tr>
										<tr id="row_low">
											<td >
												<label id="lb_low">LOW</label><br>
												<input id="low" value="" class="input" style="width:100%" required fieldType="alphanumeric" msg="Enter SAP customer number in the Low field" title="Enter SAP customer number" />
											</td>
										</tr>
										<tr id="row_high" style = "display:none">
											<td >
												<label>HIGH</label><br>
												<input id="high" value="" class="input" style="width:100%" required fieldType="alphanumeric" msg="Enter SAP customer number in the High field" title="Enter SAP customer number " />
											</td>
										</tr>
										<tr>
											<td>
												<label>CPDOnly</label><br>
												<input id="cpdonly" maxlength="1" class="input" style="width:100%" title="Enter X for one time customer"/>
											</td>
										</tr>
										<tr>
											<td align = "center">
												<button style="width:50%" class="medium"  onclick="getCustomers()">Submit</button>
											</td>
										</tr>
									</table>
								</div>
							</td>
						</tr>
					</tbody>
				</table>
			</td>
			<td valign="top">
				<table style="width:100%;height:95%" align="center" id="showDetails" style="display:none;" cellPadding="0" cellSpacing="0">
					<thead>
						<tr  height="20px" class="mediumdark">
							<th id="menuTitle" align="left" valign="top" nowrap>&nbsp;&nbsp;Response</th>
						</tr>
					</thead>
					<tbody>
						<tr>
							<td valign="top">
								<div  style="overflow:auto;width:100%;height:100%;" >
									<table border="0" cellPadding="1" cellSpacing="1" id="grid_details"  style="width:100%;height:100%" class="grid medium" displayContextMenu="false" movableColumns="false" sortable="true" saveState="false" shadeClasses = "mainbody lightmedium">
										<thead>
											<tr height="25">
												<th>Customer</th>
												<th>Name</th>
												<th>Street</th>
												<th>Country</th>
											</tr>
										</thead>
										<tbody id="tbody_details">
										</tbody>
									</table>
								</div>
							</td>
						</tr>
					</tbody>
				</table>
			</td>
		</tr>
	</table>
</body>
</html>